import { Component } from 'react';
import ReactDOM from 'react-dom/client';

/* 
  React 注册事件与DOM的事件语法非常像
    1. 语法 on事件名={事件处理函数}  比如 onClick={this.handleClick} 
    2. React事件采用驼峰命名法，比如 onMouseEnter, onClick 

  🚨常见错误：
    React事件绑定不能是函数调用。如：onClick={alert('aaa')} ，会立即执行弹窗，并不是点击再执行。
*/
class App extends Component {
  clickHandle = () => {
    alert('你好');
  };
  render() {
    // 通过 this.state 来访问类组件的状态
    return (
      <>
        <button onClick={() => alert('点点点')}>点我1</button>
        <button onClick={this.clickHandle}>点我2</button>
      </>
    );
  }
}

ReactDOM.createRoot(document.getElementById('root')).render(<App />);
